<template>
  <div>
    <MyHeader title="编辑地址" :arrow="true" text="返回"/>
    <van-address-edit :show-delete="showDelete" :area-list="areaList" @save="saveAddress"></van-address-edit>
  </div>
</template>

<script>
import MyHeader from '@/components/MyHeader'
import {areaList} from '@vant/area-data'

const address = {
  name: '',
  address: '',
  address_detail: '',
  phone: ''
}
export default {
  name: 'AddressEdit',
  components: {MyHeader},
  data() {
    return {
      areaList,
      showDelete: false,
      address: {...address}
    }
  },
  methods: {
    saveAddress(data) {
      this.address.name = data.name
      this.address.address = data.province + data.city + data.county
      this.address.address_detail = data.addressDetail
      this.address.phone = data.tel
      this.$axios.post(`/v1/users/${this.$cookies.get('user_id')}/addresses`, this.address)
        .then(({data}) => {
          if (data.code === 20000) {
            this.$dialog.alert({message: '添加地址成功'})
              .then(() => {
                this.address = {...address}
                this.$router.replace('/address')
              })
          }
        })
    }
  }
}
</script>

<style scoped>

</style>
